From: Jonas Dreßler Date: Fri, 18 Oct 2019 21:18:10 +0000 (+0200) Subject: endSessionDialog: Redesign according to new mockups X-Git-Tag: archive/raspbian/50.5-1+rpi1~1^2~781^2^2~174 X-Git-Url: https://dgit.raspbian.org/%22http://www.example.com/cgi/%22/%22http:/www.example.com/cgi/%22?a=commitdiff_plain;h=31a27586065ff1229ece313aa8d73632ff7aa8e1;p=gnome-shell.git endSessionDialog: Redesign according to new mockups See https://gitlab.gnome.org/GNOME/gnome-shell/issues/1343 https://gitlab.gnome.org/GNOME/gnome-shell/merge_requests/935 --- diff --git a/data/theme/gnome-shell-sass/widgets/_dialogs.scss b/data/theme/gnome-shell-sass/widgets/_dialogs.scss index 429105ba7..b0a964de1 100644 --- a/data/theme/gnome-shell-sass/widgets/_dialogs.scss +++ b/data/theme/gnome-shell-sass/widgets/_dialogs.scss @@ -15,8 +15,7 @@ } } -.mount-dialog-subject, -.end-session-dialog-subject { //this should be a generic header class +.mount-dialog-subject { @include fontsize($base_font_size + 3); } diff --git a/data/theme/gnome-shell-sass/widgets/_end-session-dialog.scss b/data/theme/gnome-shell-sass/widgets/_end-session-dialog.scss index 697900e16..0bca81bf3 100644 --- a/data/theme/gnome-shell-sass/widgets/_end-session-dialog.scss +++ b/data/theme/gnome-shell-sass/widgets/_end-session-dialog.scss @@ -2,49 +2,9 @@ $end_session_dialog_width: 28em; -.end-session-dialog { - spacing: $base_spacing; - border: 1px solid $bubble_borders_color; -} - -.end-session-dialog-list { - padding-top: 20px; -} - -.end-session-dialog-layout { - padding-left: 17px; - &:rtl { padding-right: 17px; } -} - -.end-session-dialog-description { - width: $end_session_dialog_width; - padding-bottom: 10px; - &:rtl { - text-align: right; - } -} - .end-session-dialog-battery-warning { width: $end_session_dialog_width; color: $warning_color; - padding-top: 6px; - &:rtl { - text-align: right; - } -} - -// user profile picture -.end-session-dialog-logout-icon { - border-radius: 99px; - width: $base_icon_size * 3; - height: $base_icon_size * 3; - background-size: contain; -} - -.end-session-dialog-shutdown-icon { - color: $fg_color; - width: $base_icon_size * 3; - height: $base_icon_size * 3; } .end-session-dialog .dialog-list-title { diff --git a/js/ui/endSessionDialog.js b/js/ui/endSessionDialog.js index 925af7483..ff1aa0ddf 100644 --- a/js/ui/endSessionDialog.js +++ b/js/ui/endSessionDialog.js @@ -21,6 +21,7 @@ const { AccountsService, Clutter, Gio, GLib, GObject, Pango, Polkit, Shell, St } = imports.gi; const CheckBox = imports.ui.checkBox; +const Dialog = imports.ui.dialog; const GnomeSession = imports.misc.gnomeSession; const LoginManager = imports.misc.loginManager; const ModalDialog = imports.ui.modalDialog; @@ -28,8 +29,7 @@ const UserWidget = imports.ui.userWidget; const { loadInterfaceXML } = imports.misc.fileUtils; -const _ITEM_ICON_SIZE = 48; -const _DIALOG_ICON_SIZE = 48; +const _ITEM_ICON_SIZE = 64; const EndSessionDialogIface = loadInterfaceXML('org.gnome.SessionManager.EndSessionDialog'); @@ -49,7 +49,6 @@ const logoutDialogContent = { showBatteryWarning: false, confirmButtons: [{ signal: 'ConfirmedLogout', label: C_("button", "Log Out") }], - iconStyleClass: 'end-session-dialog-logout-icon', showOtherSessions: false, }; @@ -68,7 +67,6 @@ const shutdownDialogContent = { { signal: 'ConfirmedShutdown', label: C_("button", "Power Off") }], iconName: 'system-shutdown-symbolic', - iconStyleClass: 'end-session-dialog-shutdown-icon', showOtherSessions: true, }; @@ -83,7 +81,6 @@ const restartDialogContent = { confirmButtons: [{ signal: 'ConfirmedReboot', label: C_("button", "Restart") }], iconName: 'view-refresh-symbolic', - iconStyleClass: 'end-session-dialog-shutdown-icon', showOtherSessions: true, }; @@ -101,7 +98,6 @@ const restartUpdateDialogContent = { unusedFutureButtonForTranslation: C_("button", "Install & Power Off"), unusedFutureCheckBoxForTranslation: C_("checkbox", "Power off after updates are installed"), iconName: 'view-refresh-symbolic', - iconStyleClass: 'end-session-dialog-shutdown-icon', showOtherSessions: true, }; @@ -119,7 +115,6 @@ const restartUpgradeDialogContent = { confirmButtons: [{ signal: 'ConfirmedReboot', label: C_("button", "Restart & Install") }], iconName: 'view-refresh-symbolic', - iconStyleClass: 'end-session-dialog-shutdown-icon', showOtherSessions: true, }; @@ -192,16 +187,6 @@ function _roundSecondsToInterval(totalSeconds, secondsLeft, interval) { return time; } -function _setLabelText(label, text) { - if (text) { - label.set_text(text); - label.show(); - } else { - label.set_text(''); - label.hide(); - } -} - function _setCheckBoxLabel(checkBox, text) { let label = checkBox.getLabelActor(); @@ -263,45 +248,21 @@ class EndSessionDialog extends ModalDialog.ModalDialog { this._userLoadedId = this._user.connect('notify::is-loaded', this._sync.bind(this)); this._userChangedId = this._user.connect('changed', this._sync.bind(this)); - let mainContentLayout = new St.BoxLayout({ - vertical: false, - x_expand: true, - y_expand: false, - }); - this.contentLayout.add_child(mainContentLayout); - - this._iconBin = new St.Bin({ - x_expand: true, - x_align: Clutter.ActorAlign.END, - }); - mainContentLayout.add_child(this._iconBin); - - let messageLayout = new St.BoxLayout({ vertical: true, - style_class: 'end-session-dialog-layout' }); - mainContentLayout.add_child(messageLayout); - - this._subjectLabel = new St.Label({ style_class: 'end-session-dialog-subject' }); - - messageLayout.add_child(this._subjectLabel); - - this._descriptionLabel = new St.Label({ - style_class: 'end-session-dialog-description', - y_expand: true, - }); - this._descriptionLabel.clutter_text.ellipsize = Pango.EllipsizeMode.NONE; - this._descriptionLabel.clutter_text.line_wrap = true; - - messageLayout.add_child(this._descriptionLabel); + this._messageDialogContent = new Dialog.MessageDialogContent(); this._checkBox = new CheckBox.CheckBox(); this._checkBox.connect('clicked', this._sync.bind(this)); - messageLayout.add(this._checkBox); + this._messageDialogContent.add_child(this._checkBox); - this._batteryWarning = new St.Label({ style_class: 'end-session-dialog-battery-warning', - text: _("Running on battery power: Please plug in before installing updates.") }); + this._batteryWarning = new St.Label({ + style_class: 'end-session-dialog-battery-warning', + text: _('Running on battery power: Please plug in before installing updates.'), + }); this._batteryWarning.clutter_text.ellipsize = Pango.EllipsizeMode.NONE; this._batteryWarning.clutter_text.line_wrap = true; - messageLayout.add(this._batteryWarning); + this._messageDialogContent.add_child(this._batteryWarning); + + this.contentLayout.add_child(this._messageDialogContent); this._applicationSection = new Dialog.ListSection({ title: _('Some applications are busy or have unsaved work'), @@ -362,11 +323,8 @@ class EndSessionDialog extends ModalDialog.ModalDialog { subject = dialogContent.subjectWithUpdates; if (dialogContent.showBatteryWarning) { - // Warn when running on battery power - if (this._powerProxy.OnBattery && this._checkBox.checked) - this._batteryWarning.opacity = 255; - else - this._batteryWarning.opacity = 0; + this._batteryWarning.visible = + this._powerProxy.OnBattery && this._checkBox.checked; } let description; @@ -400,20 +358,8 @@ class EndSessionDialog extends ModalDialog.ModalDialog { if (!description) description = dialogContent.description(displayTime); - _setLabelText(this._descriptionLabel, description); - _setLabelText(this._subjectLabel, subject); - - if (dialogContent.iconName) { - this._iconBin.child = new St.Icon({ icon_name: dialogContent.iconName, - icon_size: _DIALOG_ICON_SIZE, - style_class: dialogContent.iconStyleClass }); - } else { - let avatarWidget = new UserWidget.Avatar(this._user, - { iconSize: _DIALOG_ICON_SIZE, - styleClass: dialogContent.iconStyleClass }); - this._iconBin.child = avatarWidget; - avatarWidget.update(); - } + this._messageDialogContent.title = subject; + this._messageDialogContent.description = description; let hasApplications = this._applications.length > 0; let hasSessions = this._sessions.length > 0;